<template>
  <el-dialog
    :title="title"
    :visible.sync="openSheet"
    width="1200px"
    :destroy-on-close="true"
    :close-on-click-modal="false"
    :before-close="cancel"
  >
    <!-- 项目计划信息 -->
    <projectplanbase-info :project-plan-base-information="projectPlanBaseInformation" />
    <!-- 项目计划信息 -->
    <div class="DescriptionTitle">
      {{ $t("projectplaninfoMainTitle") }} </div>
    <el-descriptions direction="horizontal" :column="24" border>
      <el-descriptions-item :label="$t('projectType')" :span="24" content-class-name="label-with-150">{{ `${projectPlanInfoInformation.project_type || ""}` }}</el-descriptions-item>
      <el-descriptions-item :label="$t('projectScope')" :span="24" content-class-name="label-with-150">{{ projectPlanInfoInformation.scope }}</el-descriptions-item>
      <el-descriptions-item :label="$t('objectProduct')" :span="24" content-class-name="label-with-150">{{ projectPlanInfoInformation.obj_product }}</el-descriptions-item>
      <el-descriptions-item :label="$t('internalTarget')" :span="24" content-class-name="label-with-150">{{ projectPlanInfoInformation.internal_target }}</el-descriptions-item>
      <el-descriptions-item :label="$t('customerTarget')" :span="24" content-class-name="label-with-150">{{ projectPlanInfoInformation.customer_target }}</el-descriptions-item>
      <el-descriptions-item :label="$t('responsibility')" :span="24" content-class-name="label-with-150">{{ projectPlanInfoInformation.responsibility }}</el-descriptions-item>
      <el-descriptions-item :label="$t('partnerCompany')" :span="24" content-class-name="label-with-150">{{ projectPlanInfoInformation.partner_company }}</el-descriptions-item>
    </el-descriptions>

    <el-button v-if="createFlag" type="text" icon="el-icon-plus" @click="handleAdd">{{ $t('addBtn') }}</el-button>
    <el-button v-else type="text" icon="el-icon-edit" @click="handleUpdate()">{{ $t('modifyBtn') }}</el-button>
    <el-button :disabled="createFlag" type="text" icon="el-icon-delete" @click="handleDelete()">{{ $t('deleteBtn') }}</el-button>

    <div slot="footer" class="dialog-footer">
      <el-button @click="cancel">{{ $t('close') }}</el-button>
    </div>

    <projectplaninfo-sheet ref="ProjectplaninfoSheet" @refreshList="getProjectPlanInfoList" />
  </el-dialog>
</template>

<script>
import { getProjectPlanInfoListApi, deleteProjectPlanInfoApi } from '../api/projectplaninfo.api';
import projectplanbaseInfo from '../../projectplanbase/components/projectplanbase-info.vue';
import ProjectplaninfoSheet from './projectplaninfo-sheet.vue';

export default {
  components: { projectplanbaseInfo, ProjectplaninfoSheet },
  data() {
    return {
      title: undefined,
      openSheet: false,
      createFlag: true,
      projectPlanId: undefined,
      projectPlanBaseInformation: {},
      projectPlanInfoInformation: {},
      infoList: [],
      queryparams: {
        projectPlanFK: undefined
      }
    };
  },
  computed: {
  },
  methods: {
    async openSheetDialog(data) {
      this.openSheet = !this.openSheet;
      this.projectPlanBaseInformation = data;
      this.projectPlanId = data.id;
      this.getProjectPlanInfoList()
    },
    cancel() {
      this.openSheet = !this.openSheet;
    },
    // initialize() {
    //   this.getProjectPlanInfoList()
    // },
    // 获取项目计划基础信息表
    async getProjectPlanInfoList() {
      this.loading = true
      this.queryparams.projectPlanFK = this.projectPlanId
      var resp = await getProjectPlanInfoListApi({ ...this.queryparams })
      if (resp.success && resp.data.results.length > 0) {
        this.createFlag = false
        this.infoList = resp.data.results[0] // 一个项目计划只能对应一条基础信息
      } else {
        this.createFlag = true
        this.infoList = []
      }
      this.loading = false
      this.projectPlanInfoInformation = { ...this.infoList }
    },
    // 新增按钮
    handleAdd() {
      this.$refs.ProjectplaninfoSheet.openSheetDialog(this.projectPlanBaseInformation)
    },
    // 修改按钮
    handleUpdate() {
      this.$refs.ProjectplaninfoSheet.openSheetDialog(this.projectPlanBaseInformation, this.projectPlanInfoInformation)
    },
    // 删除按钮
    async handleDelete() {
      if (await this.ConfirmMessageBox(this.$t('projectplaninfoMainTitle'), this.$t('dataDeleteConfirm', { title: this.$t('projectType'), value: this.projectPlanInfoInformation.project_type }), 'warning') === 'cancel') {
        return
      }
      const resp = await deleteProjectPlanInfoApi(this.projectPlanInfoInformation.id);
      if (resp.success) {
        this.targaMessage(this.$t('deleteSuccess'));
        this.getProjectPlanInfoList();
      } else {
        this.targaMessageBox(this, resp.msg);
      }
    }
  }
};
</script>

  <style scoped>
  </style>
